<!-- 🔒 Entwickler-Hilfstool (Base64 Encoder) --> <div id="devTool" style="display:none; position:fixed; bottom:10px; right:10px; background:#111; border:2px solid #ff4444; padding:1rem; border-radius:8px; color:#fff; z-index:2000; width:280px;"> <h4 style="margin:0 0 0.5rem 0;">🔧 Base64-Tool</h4> <input type="text" id="devInput" placeholder="Text eingeben" style="width:100%;padding:0.4rem;margin-bottom:0.5rem; background:#222; color:#fff; border:1px solid #555;"> <textarea id="devOutput" readonly style="width:100%;height:60px;background:#222;color:#0f0;border:1px solid #555;padding:0.4rem;"></textarea> <p style="font-size:0.8rem;color:#aaa;margin:0;">(Drücke F2 zum Ein-/Ausblenden)</p> </div> <script> const devTool = document.getElementById("devTool"); const devInput = document.getElementById("devInput"); const devOutput = document.getElementById("devOutput"); // Toggle mit F2 document.addEventListener("keydown", e=>{ if(e.key === "F2"){ devTool.style.display = devTool.style.display==="none" ? "block" : "none"; } }); // Live-Encoding devInput.addEventListener("input", ()=>{ try { devOutput.value = btoa(devInput.value); } catch(err){ devOutput.value = "❌ Fehler bei Umwandlung"; } }); </script> <!-- 🔒 Entwickler-Hilfstool (Base64 Encoder/Decoder) --> <div id="devTool" style="display:none; position:fixed; bottom:10px; right:10px; background:#111; border:2px solid #ff4444; padding:1rem; border-radius:8px; color:#fff; z-index:2000; width:300px;"> <h4 style="margin:0 0 0.5rem 0;">🔧 Base64-Tool</h4> <label style="font-size:0.9rem;">Normaler Text → Base64</label> <input type="text" id="devInput" placeholder="Text eingeben" style="width:100%;padding:0.4rem;margin-bottom:0.5rem; background:#222; color:#fff; border:1px solid #555;"> <textarea id="devOutput" readonly style="width:100%;height:50px;background:#222;color:#0f0;border:1px solid #555;padding:0.4rem;margin-bottom:0.8rem;"></textarea> <label style="font-size:0.9rem;">Base64 → Normaler Text</label> <input type="text" id="devInputDecode" placeholder="Base64 eingeben" style="width:100%;padding:0.4rem;margin-bottom:0.5rem; background:#222; color:#fff; border:1px solid #555;"> <textarea id="devOutputDecode" readonly style="width:100%;height:50px;background:#222;color:#0f0;border:1px solid #555;padding:0.4rem;"></textarea> <p style="font-size:0.8rem;color:#aaa;margin:0.5rem 0 0 0;">(Drücke F2 zum Ein-/Ausblenden)</p> </div> <script> const devTool = document.getElementById("devTool"); const devInput = document.getElementById("devInput"); const devOutput = document.getElementById("devOutput"); const devInputDecode = document.getElementById("devInputDecode"); const devOutputDecode = document.getElementById("devOutputDecode"); // Toggle mit F2 document.addEventListener("keydown", e=>{ if(e.key === "F2"){ devTool.style.display = devTool.style.display==="none" ? "block" : "none"; } }); // Encoder devInput.addEventListener("input", ()=>{ try { devOutput.value = btoa(devInput.value); } catch(err){ devOutput.value = "❌ Fehler bei Umwandlung"; } }); // Decoder devInputDecode.addEventListener("input", ()=>{ try { devOutputDecode.value = atob(devInputDecode.value); } catch(err){ devOutputDecode.value = "❌ Ungültiger Base64-Code"; } }); </script> <div role="note" aria-label="Wichtiger Hinweis zu externem Link" style="background:#000;color:#fff;padding:16px;border-radius:10px;max-width:720px;border:2px solid #ffcc00;font-family:system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;box-shadow:0 0 10px rgba(255,204,0,0.6);"> <div style="display:flex;gap:12px;align-items:flex-start;"> <!-- Warn-Icon --> <svg width="40" height="40" viewBox="0 0 24 24" fill="none" aria-hidden="true" style="flex:0 0 40px;"> <path d="M12 2 L2 20h20L12 2z" fill="#ffcc00"/> <rect x="11" y="8" width="2" height="6" fill="#000"/> <rect x="11" y="15" width="2" height="2" fill="#000"/> </svg> <div> <div style="font-weight:700;color:#ffcc00;margin-bottom:6px;font-size:1.1rem;"> ⚠️ Achtung Abenteurer! </div> <div style="color:#eee;line-height:1.5;font-size:0.95rem;"> Hinter dieser Tür verlässt du die sichere Welt von Geocaching.com. Du betrittst eine <strong>externe Seite</strong>, für deren Inhalt Geocaching.com nicht verantwortlich ist. <br><em>Betrittst du sie, tust du das auf eigene Gefahr!</em> 🗝️ <div style="margin-top:10px;"> <a href="DEIN-LINK-HIER" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:10px 14px;background:#ff5722;color:#fff;text-decoration:none;border-radius:6px;font-weight:700;box-shadow:0 0 6px rgba(255,87,34,0.7);"> 🚪 DEIN-LINK-TEXT </a> </div> <div style="margin-top:10px;color:#ffd54f;font-size:0.9rem;"> 💡 Tipp: Öffne das Tor mit Chrome oder Chromium – andere Browser sind launisch. </div> </div> </div> </div> </div> <div role="note" aria-label="Wichtiger Verhaltens- und Haftungshinweis" style="background:#000;color:#fff;padding:16px;border-radius:10px;max-width:720px;border:2px solid #ffcc00;font-family:system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;box-shadow:0 0 10px rgba(255,204,0,0.6);margin-top:16px;"> <div style="display:flex;gap:12px;align-items:flex-start;"> <!-- Warn-Icon --> <svg width="40" height="40" viewBox="0 0 24 24" fill="none" aria-hidden="true" style="flex:0 0 40px;"> <path d="M12 2 L2 20h20L12 2z" fill="#ffcc00"/> <rect x="11" y="8" width="2" height="6" fill="#000"/> <rect x="11" y="15" width="2" height="2" fill="#000"/> </svg> <div> <div style="font-weight:700;color:#ffcc00;margin-bottom:6px;font-size:1.1rem;"> ⚠️ Wichtiger Hinweis an alle Abenteurer </div> <div style="color:#eee;line-height:1.5;font-size:0.95rem;"> Jeder ist für sein eigenes Handeln verantwortlich. Betrete das Gelände nur auf erlaubten Wegen, beschädige **nichts** und halte dich an alle lokalen Vorschriften und Regeln. <br><em>Wer die Regeln missachtet oder Schaden verursacht, trägt die volle Verantwortung!</em> <br><br> Geocaching.com und der Owner übernehmen <strong>keine Haftung</strong> für Unfälle oder Schäden. <br><br> 🗝️ Tipp: Sei ein vorsichtiger Entdecker und genieße das Abenteuer! </div> </div> </div> </div> <div style="background:#000;color:#fff;padding:16px;border-radius:10px;max-width:720px;border:2px solid #ffcc00;font-family:system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;"> <div style="display:flex;gap:12px;align-items:flex-start;"> <!-- Warn-Icon --> <span style="font-size:2rem;">⚠️</span> <div> <div style="font-weight:700;color:#ffcc00;margin-bottom:6px;font-size:1.1rem;"> Achtung Abenteurer! </div> <div style="line-height:1.5;font-size:0.95rem;"> Hinter dieser Tür verlässt du die sichere Welt von Geocaching.com. Du betrittst eine <strong>externe Seite</strong>, für deren Inhalt Geocaching.com nicht verantwortlich ist. <br><em>Betrittst du sie, tust du das auf eigene Gefahr!</em> 🗝️ <div style="margin-top:10px;"> <a href="DEIN-LINK-HIER" target="_blank" rel="noopener noreferrer" style="display:inline-block;"> <img src="DEIN-BILD-LINK-HIER" alt="Starte das Spiel" style="width:150px;height:auto;border-radius:6px;box-shadow:0 0 6px rgba(255,87,34,0.7);"> </a> </div> <div style="margin-top:10px;color:#ffd54f;font-size:0.9rem;"> 💡 Tipp: Öffne das Tor mit Chrome oder Chromium – andere Browser sind launisch. </div> </div> </div> </div> </div> <!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Die Verborgene Vision des Nostradamus</title> <style> body { background-color:#111; color:#eee; font-family:'Georgia',serif; max-width:1800px; margin:0 auto; padding:2rem; } h1,h2,h3,h5 { color:#ff4444; } .input-timer-container{display:flex;flex-direction:column;gap:0.6rem;margin-bottom:1rem;max-width:600px;} .code-input-row{display:flex;align-items:center;gap:0.6rem;} input[type="text"]{padding:0.5rem;font-size:1rem;flex:1;border-radius:6px;border:1px solid #555;background:#222;color:#eee;} button{padding:0.5rem 1rem;background:#ff4444;color:white;border:none;cursor:pointer;border-radius:6px;transition:background 0.3s ease;} button:hover{background:#cc0000;} .coord-row{display:flex;gap:0.4rem;margin-bottom:0.4rem;max-width:600px;} .coord-box{flex:1;background:#222;border:2px solid #555;border-radius:8px;padding:0.5rem;text-align:center;font-size:1.1rem;color:#00ff00;user-select:none;min-width:40px;} .vision{background:#222;padding:1rem;border-radius:8px;margin-bottom:1rem;border-left:4px solid #ff4444;font-style:italic;white-space:pre-line;max-width:800px;} #timer{font-size:1.5rem;text-align:center;font-family:monospace;background:#222;padding:0.8rem 1.5rem;border-radius:8px;border:2px solid #555;width:fit-content;margin:0 auto 1rem;box-shadow:0 0 8px rgba(255,68,68,0.5);max-width:600px;} .icons{font-size:2rem;margin:0.5rem 0;} #infoOverlay{display:none;position:fixed;top:5%;left:50%;transform:translateX(-50%);width:70%;max-height:60%;background:rgba(0,0,0,0.95);color:#fff;z-index:999;padding:2rem;overflow-y:auto;border:2px solid #ff4444;border-radius:12px;box-shadow:0 0 20px rgba(255,68,68,0.6);} #infoOverlay .close-btn{background:#ff4444;padding:0.5rem 1rem;border:none;cursor:pointer;color:white;font-size:1rem;border-radius:6px;position:sticky;bottom:0;display:block;width:20%;margin:1rem auto;} #restartOverlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.9);color:#fff;z-index:1000;padding:2rem;text-align:center;} #restartOverlay button{background:#ff4444;padding:0.5rem 1rem;border:none;cursor:pointer;color:white;font-size:1rem;} </style> </head> <body> <h3>Veritas Secreta Nostradami #1</h3> <div class="vision"> (Entdeckt in einem vergessenen Manuskript, datiert auf das Jahr 1557) "Im fernen Eisland, wo der Atem der Erde gefriert, wird ein Kind mit finsterem Blick geboren, ein Sohn des Volkes, doch nicht für das Volk, sondern für die Krone. Er wird wandern, barfuß durch Staub und Schnee, mit Worten, die wie Messer schneiden, und mit Händen, die Blut zum Stillstand bringen. Die Mutter eines blutenden Prinzen, eine Zarin im Schatten, wird sich an ihn klammern wie eine Ertrinkende an Treibholz. Sie nennt ihn ein Werkzeug Gottes, doch andere nennen ihn Teufel, Heuchler, Hexer, Scharlatan. Er wird sitzen an Tischen mit Goldgedecken, doch sein Hunger gilt nicht dem Brot, sondern der Macht, sein Wein wird mit Gift gemischt, doch er trinkt ohne zu sterben. Vier Male werden sie ihn töten wollen, mit Kelch und Klinge, mit Kugel und kaltem Strom. Der Tod kommt, doch zögert, er lacht, und sein Blut ruft weiter durch den Schnee. Wenn die Brücke der Stadt gefriert und der Fluss fließt wie schwarzes Glas, wird das Tier endlich sinken, doch mit ihm stürzt das Reich. Die Stadt wird fallen, Kronen zerbrechen, und die Welt wird sich fragen: War er Mensch? Oder das erste Zeichen vom Ende? Wer den dunklen Seher aus dem frostigen Reich erkennt, dem wird der Schlüssel zum Spiel gewährt. Doch hüte dich, die Zeit ist der Feind des Wissens. Wenn der Schatten des Spiels erlischt und die Zeit verrinnt, so beginnt alles von neuem, das Rad dreht sich von vorn. Der Schlüssel in deiner Hand bleibt nur für den Augenblick, nach Ablauf der Zeit, wird der Schleier wieder verschlossen." </div> <div class="input-timer-container"> <h5>🔒 „Erkenne in der Vision, wen Nostradamus in seiner Weisheit beschreibt …“</h5> <div class="code-input-row"> <input type="text" id="codeInput" placeholder="Code hier eingeben" /> <button id="codeBtn" onclick="checkCode()">Bestätigen</button> </div> <p id="codeFeedback" style="margin:0 0 0.5rem 0; color:#ff4444;"></p> <div id="timer" style="display:none;">⏳ Zeit verbleibend: <span id="time">07:00</span></div> </div> <div class="coord-row" id="coordRow1" style="display:none;"> <div class="coord-box" id="coord0">N48°</div> <div class="coord-box" id="coord1">?</div> <div class="coord-box" id="coord2">?</div> <div class="coord-box" id="coord3">?</div> <div class="coord-box" id="coord4">?</div> </div> <div class="coord-row" id="coordRow2" style="display:none;"> <div class="coord-box" id="coord5">E08°</div> <div class="coord-box" id="coord6">?</div> <div class="coord-box" id="coord7">?</div> <div class="coord-box" id="coord8">?</div> <div class="coord-box" id="coord9">?</div> </div> <div id="game" style="display:none;"></div> <div id="infoOverlay"> <h3>Rasputin – Der Mann, der nicht sterben wollte</h3> <p> Russland, Winter 1916.<br> Ein eisiger Nebel liegt über Petrograd. In den Gassen flüstert man von einem Mann, der den Tod überlistet hat.<br> Grigori Jefimowitsch Rasputin wurde am 21. Januar 1869 im kleinen sibirischen Dorf Pokrowskoje geboren. Als einfacher Bauernsohn aufgewachsen, suchte er früh nach spiritueller Erleuchtung. Auf zahlreichen Pilgerreisen durch Russland wurde er bald als „heiliger Mann" verehrt, ein Mystiker mit angeblich übernatürlichen Kräften.<br> Sein Ruf als Wunderheiler führte ihn bis an den Zarenhof nach St. Petersburg. Dort begegnete er der Zarin Alexandra Fjodorowna, der Ehefrau von Zar Nikolaus II. Die Zarin war tief verzweifelt über die Erbkrankheit ihres Sohnes Alexei, der an Hämophilie litt, einer Krankheit, bei der das Blut nicht richtig gerinnt. Rasputin schien Alexei helfen zu können. Ob durch Hypnose, Gebete oder bloßen Zufall, seine Erfolge verschafften ihm das uneingeschränkte Vertrauen der Zarin.<br> Am Zarenhof gewann Rasputin rasch Einfluss, was ihn zur Zielscheibe für Hofintrigen, politischen Hass und Mordpläne machte. Seine Gegner sahen in ihm einen gefährlichen Scharlatan, der mit dunklen Kräften spielte und das Reich ins Chaos stürzte. Doch Rasputin überlebte, angeblich mehrere Anschläge.<br> Sein Tod am 30. Dezember 1916 ist bis heute legendär: Adlige Verschwörer luden Rasputin zum Abendessen und mischten ihm Gift in Wein und Kuchen. Doch das Gift zeigte keine Wirkung. Daraufhin stachen sie auf ihn ein, doch Rasputin versuchte zu fliehen. Als er sich losriss, schossen sie mehrfach auf ihn. Noch immer nicht besiegt, soll er erneut versucht haben zu entkommen. Schließlich wurde er brutal geschlagen und in den eisigen Fluss Newa geworfen, wo er endgültig ertrank.. So entstand der Mythos vom „Mann, der nicht sterben wollte".<br> Rasputin wurde zum Symbol für das untergehende Zarenreich, geheimnisvoll, umstritten, scheinbar unbesiegbar. </p> <button class="close-btn" onclick="closeInfo()">Schließen & zurück zum Spiel</button> </div> <div id="restartOverlay"> <h2>⏳ Die Zeit hat dich besiegt</h2> <p>Du konntest die Vision nicht rechtzeitig entschlüsseln…</p> <button onclick="location.reload()">🔄 Neustart</button> </div> <script> // ---------- Hilfsfunktion: aus CharCode-Arrays String bauen ---------- function u(arr){ return arr.map(x => String.fromCharCode(x)).join(""); } // ---------- Verschleierte Spielfelder (nur CharCodes; kein Klartext) ---------- const geheim = { c: [82,97,115,112,117,116,105,110], // "Rasputin" (sichtbar nur als Zahlen) q: [ // t = Frage-Text (als Klartext), a = Antwort-Array (CharCodes), i = coordIndex, v = coordValue { t: "Welches eisige Gebiet ist gemeint?", a: [83,105,98,105,114,105,101,110], i: 1, v: "57." }, // "Sibirien" { t: "Was war seine Herkunft? (zwei Wörter)", a: [101,105,110,102,97,99,104,101,114,32,66,97,117,101,114,110,115,111,104,110], i: 6, v: "50." }, // "einfacher Bauernsohn" { t: "Welcher Begriff passt zu seiner zwielichtigen Rolle?", a: [83,99,104,97,114,108,97,116,97,110], i: 2, v: "1" }, // "Scharlatan" { t: "Wie hieß die Zarin, die ihn unterstützte?", a: [90,97,114,105,110,32,65,108,101,120,97,110,100,114,97,32,70,106,111,100,111,114,111,119,110,97], i: 7, v: "1" }, // "Zarin Alexandra Fjodorowna" { t: "🔍Mord: Die 4 Simjon-Mittel:<div class='icons'>🧪 🔪 🔫 🌊</div> Gib ihre Bedeutung in richtiger Reihenfolge ein (mit Komma):", a: [103,105,102,116,44,109,101,115,115,101,114,44,112,105,115,116,111,108,101,44,119,97,115,115,101,114], i: 3, v: "2" }, // "gift,messer,pistole,wasser" { t: "Wie heißt die Erbkrankheit ihres Sohnes Alexei?", a: [72,228,109,111,112,104,105,108,105,101], i: 8, v: "7" }, // "Hämophilie" { t: "Worauf war sein Hunger gerichtet?", a: [109,97,99,104,116], i: 4, v: "7" }, // "macht" { t: "Wie lautet das letzte Wort der Prophezeiung?", a: [118,101,114,115,99,104,108,111,115,115,101,110], i: 9, v: "0" } // "verschlossen" ] }; // ---------- Vergleichs-Helper ---------- function canonical(s){ if(!s && s !== '') return ''; let t = String(s).normalize('NFC').toLowerCase(); t = t.replace(/\s+/g,''); t = t.replace(/[.,;:!?'"„”“()\-]/g,''); return t; } // ---------- Spielzustand ---------- const coords = ["N48°","","","","","E08°","","","",""]; let current = 0, timeLeft = 7 * 60, timer = null; function updateTimerDisplay(){ const m = Math.floor(timeLeft/60); const s = timeLeft % 60; document.getElementById('time').textContent = `${m.toString().padStart(2,'0')}:${s.toString().padStart(2,'0')}`; } // ---------- Code-Eingabe (Start) ---------- function checkCode(){ const val = document.getElementById('codeInput').value.trim(); const code = u(geheim.c); if(canonical(val) === canonical(code)){ document.getElementById('codeFeedback').textContent = ''; document.getElementById('infoOverlay').style.display = 'block'; document.getElementById('timer').style.display = 'block'; document.getElementById('coordRow1').style.display = 'flex'; document.getElementById('coordRow2').style.display = 'flex'; document.getElementById('game').style.display = 'block'; updateTimerDisplay(); if(!timer) timer = setInterval(countdown, 1000); renderQuestion(); } else { document.getElementById('codeFeedback').textContent = '❌ Falscher Code.'; } } function closeInfo(){ document.getElementById('infoOverlay').style.display = 'none'; } // ---------- Fragen anzeigen ---------- function renderQuestion(){ if(current >= geheim.q.length){ document.getElementById('game').innerHTML = ` <div class="vision"> <h5>🎉 „Acht Prüfungen hast du bestanden, ehe der letzte Korn des Sandes die Tiefe der Zeit berührte. Die Koordinaten wurden dir offenbart, ein Zeichen, dass das Auge der Weisheit auf dich gefallen ist. Doch sei gewarnt: Dies ist nicht das Ende, sondern der Beginn eines Pfades, der sich windet wie der Atem des Schicksals. Die Klarheit wird schwinden, und die Rätsel, die einst leicht erschienen, werden sich in Schatten hüllen. Die Prüfungen, die noch vor dir liegen, sind älter als Erinnerung und tiefer als das Meer der Erkenntnis. Bereite dich vor auf das, was jenseits der Schwelle wartet. Und vergiss nicht: Nur wer die Schatten der Vergangenheit zu deuten vermag, wird die Schleier der Zukunft zerreißen.“</h5> <p>Finale Koordinaten: <strong>${coords.join(' ')}</strong></p> <div style="margin-top:1rem; padding:0.8rem; background:#111; border:1px solid #444; border-radius:6px;"> <strong>Bonuscode:</strong> <p>Heute, als Belohnung für deinen Eifer, erhältst du einen Schlüssel, ein Werkzeug, das dir in den kommenden Visionen den Zugang zu verborgenen Türen ermöglichen wird. Dieser Schlüssel wird nur dann von Nutzen sein, wenn du den richtigen Blickwinkel einnimmst und die Geheimnisse hinter den einfachen Worten erkennst, die den Weg zur wahren Weisheit weisen. In deinen Händen liegt die Macht, die Tore zu öffnen, aber nur, wenn du die Sprache der Alten verstehst. Manchmal sind die größten Geheimnisse in den einfachsten Dingen verborgen. <center><em>Es gibt ein Wort, das in beiden Richtungen die gleiche Bedeutung trägt, ein Ort, an dem Dinge aufgehoben und gesammelt werden.</em></center> </p> </div> </div> `; clearInterval(timer); timer = null; return; } const q = geheim.q[current]; document.getElementById('game').innerHTML = ` <div class="question"> <h3>Rätsel ${current + 1}:</h3> <p>${q.t}</p> <input type="text" id="userAnswer" placeholder="Deine Antwort" /> <button id="answerBtn" onclick="checkAnswer()">Bestätigen</button> <p id="feedback" style="color:#ff4444;"></p> </div>`; const ua = document.getElementById('userAnswer'); if(ua) ua.focus(); } // ---------- Antwortprüfung ---------- function checkAnswer(){ const inputEl = document.getElementById('userAnswer'); const input = inputEl ? inputEl.value : ''; const expected = u(geheim.q[current].a); if(canonical(input) === canonical(expected)){ coords[geheim.q[current].i] = geheim.q[current].v; updateCoords(); current++; renderQuestion(); } else { document.getElementById('feedback').textContent = '❌ Falsche Antwort. Versuch\'s nochmal.'; } } function updateCoords(){ for(let i=0;i<coords.length;i++){ const el = document.getElementById(`coord${i}`); if(el) el.textContent = coords[i] || '?'; } } function countdown(){ if(timeLeft <= 0){ clearInterval(timer); timer = null; document.getElementById('restartOverlay').style.display = 'block'; return; } timeLeft--; updateTimerDisplay(); } // ---------- Enter-Taste Support ---------- document.addEventListener('DOMContentLoaded', function(){ const codeInput = document.getElementById('codeInput'); if(codeInput){ codeInput.addEventListener('keydown', function(e){ if(e.key === 'Enter') checkCode(); }); } document.addEventListener('keydown', function(e){ if(e.key === 'Enter'){ const ua = document.getElementById('userAnswer'); if(ua && ua === document.activeElement){ checkAnswer(); } } }); }); // --- Ende: keine automatische Initialisierung, startet erst nach richtigem Code --- </script> </body> </html>